<template>
	<view
		class="cake-item" 
		@tap="handleDetail" 
	>
		<image class="poster" :src="gdata.img" mode=""></image>
		<view class="">
			<view class="flex justify-between">
				<view class="title">
					<view class="fs-28">
						{{gdata.name}}
					</view>
					<view class="fs-18 text-cut">
						{{gdata.french}}
					</view>
				</view>
				<view @tap.stop="handleCartAdd" class="cart-btn text-center margin-right-sm">
					<text class="iconfont icon-gouwuche"></text>
				</view>
			</view>
			
			<view class="fs-22">
				<text>￥</text>
				{{gdata.price}}
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name:"good-item",
		props:['gdata'],
		data() {
			return {
				
			};
		},
		methods: {
			handleDetail() {
				// console.log(1111);
				uni.navigateTo({
					url:'/pages/detail/detail'
				})
			},
			handleCartAdd(){ //新增商品
				this.$store.commit('cart/initOverlayDataMut',{
					obj:this.gdata,
					edit:-1
				})
				// this.$store.commit('cart/cartAddMut',this.gdata)
			}
		},
	}
</script>

<style lang="scss">
.cake-item{
	margin-bottom:20upx;
	width:350upx;
	.title{
		max-width: 70%;
	}
	.poster{
		width: 350upx;
		height: 350upx;
		background-color: #d8d8d8;
		margin-bottom: 10upx;
	}
	.fs-18{
		margin: 10upx 0;
	}
}
.cart-btn{
	width: 60upx;
	height: 60upx;
	border-radius: 50%;
	background-color: #ffe32a;
	font-size: 30upx;
	line-height: 60upx;
}
</style>
